window.onload=function (){
    function getTop(e) {
        var offset = e.offsetTop;
        if (e.offsetParent != null) offset += getTop(e.offsetParent);
        return offset;
    }

    function getLeft(e) {
        var offset = e.offsetLeft;
        if (e.offsetParent != null) offset += getLeft(e.offsetParent);
        return offset;
    }

    const showEffectName = 'draw'; //从起点到终点绘制线条 fade 淡入淡出 none 无效果，即直接显示
    const animOptions = {// 动画参数
        duration: 1000, //持续时长
        timing: 'ease-in', // 动画函数
    };

    function sleep(time){
        var timeStamp = new Date().getTime();
        var endTime = timeStamp + time;
        while(true){
            if (new Date().getTime() > endTime){
                return;
            }
        }
    }
    function tuodong (event) {
        //endEle.setPointerCapture(1);//捕获点击事件到自己身上，避免全选时其他元素被波及
        (this.setCapture && this.setCapture())||(this.setPointerCapture && this.setPointerCapture(1))
        //点上后，计算鼠标跟div的相对位置差
        event=event||window.event;
        var mx=event.clientX;
        var my=event.clientY;
        var dx=this.offsetLeft;
        var dy=this.offsetTop;
        var cx=mx-dx;
        var cy=my-dy;
        //定一个全局鼠标移动事件
        let obj=this //this表示被拖动的div
        document.onmousemove=function(event){
            event=event||window.event;
            //获取鼠标位置
            var mx=event.clientX;
            var my=event.clientY;
            //算出div顶点应该出现的位置
            var dx=mx-cx;
            var dy=my-cy;
            //重新定义div的位置
            obj.style.left=dx+"px";
            obj.style.top=dy+"px";

            let addEle=document.getElementById(event.target.id+"AddId")
            if(addEle){
                console.log("yes")
                addEle.style.left=event.target.offsetLeft+event.target.offsetWidth+"px"
                addEle.style.top=event.target.offsetTop+event.target.offsetHeight-30+"px"
            }else{
                console.log("no")
            }

            for(var i in obj.leader_lines){
                obj.leader_lines[i].position()
            }
            //定一个全局鼠标抬起事件，防止点上上层下层不触发。
            document.onmouseup=function () {
                //console.log(obj.style.left,obj.style.top); //用这里触发ajax存储到数据库中
                //全局鼠标移动事件为空
                document.onmousemove=null;
                //全局鼠标抬起事件为空
                document.onmouseup=null;
                //endEle.releasePointerCapture(1);//释放捕获鼠标事件，否则会连续捕获下去，以后次次点击都承接到他自己身上了。
                (obj.releaseCapture && obj.releaseCapture() ) ||(obj.releasePointerCapture && obj.releasePointerCapture(1) )
            }
        }
        return false//取消拖拽的搜索默认行为
    }

    function f(tou,wei,kaishiyanse,jieshuyanse,yangshi) {//头,尾,开始颜色,结束颜色,样式
        let new_line;
        let options={
            startPlugColor: kaishiyanse, // 渐变色开始色#ff3792
            endPlugColor: jieshuyanse, // 渐变色结束色
            gradient: true, // 使用渐变色
            hide: true,//这个东西还跟线条画出有关系,true 则线条画出,false则线条不画出
        }
        if(yangshi=="xuxian"){//如果是虚线就设置这一项
            options.dash={animation: true}
        }
        new_line=new LeaderLine(
            tou,wei,options
        )
        function addLineInElement(element,line) {
            if(element.leader_lines){
                element.leader_lines.push(line)
            }else{
                element.leader_lines=[];
                element.leader_lines.push(line)
            }
            element.onmousedown=tuodong
        }
        addLineInElement(tou,new_line)
        addLineInElement(wei,new_line)

        new_line.show(showEffectName, animOptions)
        return new_line;//返回一个函数
    }

}
